<template>
  <el-dialog
    title="操作"
    width="716px"
    :visible.sync="dialogVisibleClass"
    top="50px"
    :close-on-click-modal="false"
    @open="beforeOpen"
    @close="beforeClose"
  >
    <div class="dialog dialogVisibleClass">
      <el-form
        :model="form"
        ref="form"
        :rules="formRules"
        :inline="true"
        label-width="90px"
        class="form"
      >
        <el-row>
          <el-col :span="11" :offset="1">
            <el-form-item label="姓名" prop="name">
              <el-input type="text" v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item label="一级部门">
              <el-input type="text" v-model="form.department_one"></el-input>
            </el-form-item>
            <el-form-item label="选择课程" prop>
              <!-- <el-cascader
                expand-trigger="hover"cd
                :show-all-levels="false"
                :options="options"
                v-model="form"
                :props="prop"
                @change="getPayment"
              ></el-cascader>-->
            </el-form-item>
            <div class="space" style="margin-top:20px;"></div>
            <el-form-item label="课程总数">
              <!-- <el-input type="text" v-model="form"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :span="11" :offset="1">
            <!-- <el-form-item label="原价单价">
              <el-input type="text" v-model="form"></el-input>
            </el-form-item>
            <el-form-item label="原价总价">
              <el-input type="text" v-model="form"></el-input>
            </el-form-item>
            <el-form-item label="折扣单价">
              <el-input type="text" v-model="form"></el-input>
            </el-form-item>
            <el-form-item label="折扣总价">
              <el-input type="text" v-model="form"></el-input>
            </el-form-item>-->
          </el-col>
        </el-row>
        <el-row style="text-align:center;">
          <span>
            <el-button type="primary" @click="dialogVisibleClass = false">确 定</el-button>
            <el-button type="danger" @click="beforeClose">取 消</el-button>
          </span>
        </el-row>
      </el-form>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'addStaff',
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    rowData: {
      type: Object,
      default: {}
    }
  },
  components: {},
  data() {
    return {
      dialogVisibleClass: this.dialogVisible,
      form: {
        name: '',
        department_one: '',

      },
      formRules: {
        name: [
          { required: true, message: '不能为空', trigger: ['blur', 'change'] },
          { type: 'string', pattern: /^[\u4e00-\u9fa5]{2,14}$/, message: '请输入2-14位汉字', trigger: ['blur', 'change'] }
        ],

      }
    }
  },
  computed: {},
  methods: {
    //打开弹窗回调
    beforeOpen() {

    },
    //关闭弹窗回调
    beforeClose() {
      this.dialogVisibleClass = false
      this.$emit("on-status-change", false);
    }
  },
  mounted() { },
  updated() { },
  watch: {
    dialogVisible(val) {
      this.dialogVisibleClass = val;
    },
  },
  created() { },
  destroyed() { },
}

</script>

<style scoped lang='less'>
.form {
  overflow: hidden;
}
</style>
